<template>
  <div>
    <app-container>
      <generate-form ref="generateForm" :data="jsonData" :remote="remoteFuncs" :value="editData" />
      <div class="generate-block">
        <el-button type="primary" @click="handleSubmit">提交</el-button>
        <el-button type="primary">重置</el-button>
      </div>
    </app-container>
    <app-container>
      <generate-table ref="generateTable" :data="jsonData_T" :remote="remoteFuncs" :value="editData">
        <!--自定义新增编辑页面内容-->
        <!--<template slot="table_dialog" slot-scope="scope">-->
        <!--<generate-form :ref="scope.form" :data="jsonData" :remote="remoteFuncs" :value="scope.data"/>-->
        <!--</template>-->
      </generate-table>
      <div class="generate-block">
        <router-link to="/PrivateLibrary/AccountModule/AccountManagement/InterAcctBatch">
          <el-button type="primary">批量结账</el-button>
        </router-link>
      </div>
    </app-container>
  </div>
</template>
<script>
import GenerateForm from '@/components/CreateForm/GenerateForm'
import '@/components/CreateForm/styles/FormCreate.css'
import { getCodeList } from '@/api/codelist'
import GenerateTable from '@/components/CreateTable/GenerateTable'
export default {
  name: 'InterAcctHangingDefinition',
  components: {
    GenerateForm,
    GenerateTable
  },
  data: function() {
    return {
      jsonData: {
        'list': [
          {
            'type': 'grid',
            'name': '栅格布局',
            'icon': 'th',
            'columns': [
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '销账指定科目：',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352006000_89717'
                    },
                    'key': '1542352006000_89717',
                    'model': 'input_1542352006000_89717',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '单行文本格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 5,
                'list': [
                  {
                    'type': 'input',
                    'name': '摘要代码：',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352011000_80652'
                    },
                    'key': '1542352011000_80652',
                    'model': 'input_1542352011000_80652',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '单行文本格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 8,
                'list': [
                  {
                    'type': 'input',
                    'name': '摘要：',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352011000_80652'
                    },
                    'key': '1542352011000_80652',
                    'model': 'input_1542352011000_80652',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '单行文本格式不正确'
                      }
                    ]
                  }
                ]
              }
            ],
            'options': {
              'gutter': 0,
              'justify': 'start',
              'align': 'top',
              'remoteFunc': 'func_1542351994000_78447'
            },
            'key': '1542351994000_78447',
            'model': 'grid_1542351994000_78447',
            'rules': []
          }
        ],
        'config': {
          'labelWidth': 100,
          'labelPosition': 'right'
        },
        'table': {
          'showRemove': false,
          'showIndexCol': false,
          'showEdit': false,
          'showExport': false,
          'showAdd': false,
          'stripe': true,
          'border': false
        }
      },
      jsonData_T: {
        'list': [
          {
            'type': 'grid',
            'name': '栅格布局',
            'icon': 'th',
            'columns': [
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '挂销账编号',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352317000_60266'
                    },
                    'key': '1542352317000_60266',
                    'model': 'input_1542352317000_60266',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '单行文本格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '挂账序号',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352321000_45986'
                    },
                    'key': '1542352321000_45986',
                    'model': 'input_1542352321000_45986',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '单行文本格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'select',
                    'name': '挂账状态',
                    'icon': 'regular/caret-square-down',
                    'options': {
                      'defaultValue': '',
                      'multiple': false,
                      'disabled': false,
                      'clearable': false,
                      'placeholder': '',
                      'required': false,
                      'showLabel': false,
                      'width': '100%',
                      'options': [
                        {
                          'value': '下拉框1'
                        },
                        {
                          'value': '下拉框2'
                        },
                        {
                          'value': '下拉框3'
                        }
                      ],
                      'remote': false,
                      'remoteOptions': [],
                      'props': {
                        'value': 'value',
                        'label': 'label'
                      },
                      'remoteFunc': 'func_1542352327000_10309'
                    },
                    'key': '1542352327000_10309',
                    'model': 'select_1542352327000_10309',
                    'rules': []
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'date',
                    'name': '挂账日期',
                    'icon': 'regular/calendar-alt',
                    'options': {
                      'defaultValue': '',
                      'readonly': false,
                      'disabled': false,
                      'editable': true,
                      'clearable': true,
                      'placeholder': '',
                      'startPlaceholder': '',
                      'endPlaceholder': '',
                      'type': 'date',
                      'format': 'yyyy-MM-dd',
                      'timestamp': false,
                      'required': false,
                      'width': '100%',
                      'remoteFunc': 'func_1542352333000_57148'
                    },
                    'key': '1542352333000_57148',
                    'model': 'date_1542352333000_57148',
                    'rules': []
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'date',
                    'name': '挂账到日期',
                    'icon': 'regular/calendar-alt',
                    'options': {
                      'defaultValue': '',
                      'readonly': false,
                      'disabled': false,
                      'editable': true,
                      'clearable': true,
                      'placeholder': '',
                      'startPlaceholder': '',
                      'endPlaceholder': '',
                      'type': 'date',
                      'format': 'yyyy-MM-dd',
                      'timestamp': false,
                      'required': false,
                      'width': '100%',
                      'remoteFunc': 'func_1542352481000_1305'
                    },
                    'key': '1542352481000_1305',
                    'model': 'date_1542352481000_1305',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '挂销账编号格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '挂账金额',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352321000_45986'
                    },
                    'key': '1542352321000_45986',
                    'model': 'input_1542352321000_45986',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '挂账序号格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'date',
                    'name': '销账日期',
                    'icon': 'regular/calendar-alt',
                    'options': {
                      'defaultValue': '',
                      'readonly': false,
                      'disabled': false,
                      'editable': true,
                      'clearable': true,
                      'placeholder': '',
                      'startPlaceholder': '',
                      'endPlaceholder': '',
                      'type': 'date',
                      'format': 'yyyy-MM-dd',
                      'timestamp': false,
                      'required': false,
                      'width': '100%',
                      'remoteFunc': 'func_1542352507000_5461'
                    },
                    'key': '1542352507000_5461',
                    'model': 'date_1542352507000_5461',
                    'rules': []
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '销账金额',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352522000_78816'
                    },
                    'key': '1542352522000_78816',
                    'model': 'input_1542352522000_78816',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '单行文本格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '内部核算账号',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352613000_41017'
                    },
                    'key': '1542352613000_41017',
                    'model': 'input_1542352613000_41017',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '挂账金额格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '摘要代码',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352634000_34848'
                    },
                    'key': '1542352634000_34848',
                    'model': 'input_1542352634000_34848',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '单行文本格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '摘要',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352661000_68929'
                    },
                    'key': '1542352661000_68929',
                    'model': 'input_1542352661000_68929',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '销账金额格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '交易码',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352676000_60862'
                    },
                    'key': '1542352676000_60862',
                    'model': 'input_1542352676000_60862',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '单行文本格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'select',
                    'name': '公司代码',
                    'icon': 'regular/caret-square-down',
                    'options': {
                      'defaultValue': '',
                      'multiple': false,
                      'disabled': false,
                      'clearable': false,
                      'placeholder': '',
                      'required': false,
                      'showLabel': false,
                      'width': '100%',
                      'options': [
                        {
                          'value': '下拉框1'
                        },
                        {
                          'value': '下拉框2'
                        },
                        {
                          'value': '下拉框3'
                        }
                      ],
                      'remote': false,
                      'remoteOptions': [],
                      'props': {
                        'value': 'value',
                        'label': 'label'
                      },
                      'remoteFunc': 'func_1542352813000_45087'
                    },
                    'key': '1542352813000_45087',
                    'model': 'select_1542352813000_45087',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '公司代码格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'input',
                    'name': '交易流水',
                    'icon': 'regular/keyboard',
                    'options': {
                      'width': '100%',
                      'defaultValue': '',
                      'required': false,
                      'dataType': 'string',
                      'pattern': '',
                      'placeholder': '',
                      'readonly': false,
                      'disabled': false,
                      'clearable': false,
                      'remoteFunc': 'func_1542352843000_95523'
                    },
                    'key': '1542352843000_95523',
                    'model': 'input_1542352843000_95523',
                    'rules': [
                      {
                        'type': 'string',
                        'message': '单行文本格式不正确'
                      }
                    ]
                  }
                ]
              },
              {
                'span': 6,
                'list': [
                  {
                    'type': 'date',
                    'name': '时间戳',
                    'icon': 'regular/calendar-alt',
                    'options': {
                      'defaultValue': '',
                      'readonly': false,
                      'disabled': false,
                      'editable': true,
                      'clearable': true,
                      'placeholder': '',
                      'startPlaceholder': '',
                      'endPlaceholder': '',
                      'type': 'date',
                      'format': 'yyyy-MM-dd',
                      'timestamp': false,
                      'required': false,
                      'width': '100%',
                      'remoteFunc': 'func_1542352860000_43640'
                    },
                    'key': '1542352860000_43640',
                    'model': 'date_1542352860000_43640',
                    'rules': []
                  }
                ]
              }
            ],
            'options': {
              'gutter': 0,
              'justify': 'start',
              'align': 'top',
              'remoteFunc': 'func_1542352303000_48915'
            },
            'key': '1542352303000_48915',
            'model': 'grid_1542352303000_48915',
            'rules': []
          }
        ],
        'config': {
          'labelWidth': 100,
          'labelPosition': 'right'
        },
        'table': {
          'showRemove': false,
          'showIndexCol': false,
          'showEdit': false,
          'showExport': false,
          'showAdd': false,
          'stripe': true,
          'border': false
        }
      },
      editData: {},
      values: {},
      remoteFuncs: {
        func_getMKFBdic(resolve) {
          // 获取到远端数据后执行回调函数
          // resolve(data)
          getCodeList('').then(response => {
            resolve(response.data)
          })
        }
      }
    }
  },
  methods: {
    handleSubmit() {
      this.$refs.generateForm.getData().then(data => {
        // 数据校验成功
        // data 为获取的表单数据
      }).catch(e => {
        // 数据校验失败
      })
    }
  }
}
</script>
